<form action="">

    <input type="checkbox" id="search_first_name_enabled">
    <label for="search_first_name_enabled">
        First Name
    </label>
    <input type="text" id="search_first_name" name="search_first_name">
    <br />

    <input type="checkbox" id="search_last_name_enabled">
    <label for="search_last_name_enabled">
        Last name
    </label>
    <input type="text" id="search_last_name" name="search_last_name">
    <br />

    <input type="checkbox" id="search_email_enabled">
    <label for="search_email_enabled">
        Email
    </label>
    <input type="text" id="search_email" name="search_email">
    <br />

    <input type="checkbox" id="search_phone_enabled">
    <label for="search_phone_enabled">
        Phone
    </label>
    <input type="text" id="search_phone" name="search_phone">
    <br />

    <input type="checkbox" id="search_hair_color_enabled">
    <label for="search_hair_color_enabled">
        Hair color
    </label>
    <input type="text" id="search_hair_color" name="search_hair_color">
    <br />

    <input type="checkbox" id="search_dyed_hair_color_enabled">
    <label for="search_dyed_hair_color_enabled">
        Dyed hair color
    </label>
    <input type="text" id="search_dyed_hair_color" name="search_dyed_hair_color">
    <br />

    <input type="checkbox" id="search_eyes_color_enabled">
    <label for="search_eyes_color_enabled">
        Eyes color
    </label>
    <input type="text" id="search_eyes_color" name="search_eyes_color">
    <br />

    <input type="checkbox" id="search_city_enabled">
    <label for="search_city_enabled">
        City
    </label>
    <input type="text" id="search_city" name="search_city">
    <br />

    <input type="checkbox" id="search_sex_enabled">
    <label for="search_sex_enabled">
        Sex
    </label>
    <select id="search_sex">
        <option value="m">M</option>
        <option value="f">F</option>
    </select>
    <br />
    <br />

    Activities <br />

    <input type="checkbox" id="search_sampling_enabled" value="1">
    <label for="search_sampling_enabled">
        Sampling
    </label><br />

    <input type="checkbox" id="search_merchandising_enabled" value="1">
    <label for="search_merchandising_enabled">
        Merchandising
    </label><br />

    <input type="checkbox" id="search_promotion_enabled" value="1">
    <label for="search_promotion_enabled">
        Promotion
    </label><br />

    <input type="checkbox" id="search_caravan_enabled" value="1">
    <label for="search_caravan_enabled">
        Caravan
    </label><br />

    <input type="checkbox" id="search_mistery_shopper_enabled"v>
    <label for="search_mistery_shopper_enabled">
        Mistery shopper
    </label><br />

    <input type="checkbox" id="search_door_to_door_enabled" value="1">
    <label for="search_door_to_door_enabled">
        Door to door
    </label><br />
    <br />
    Language <br />

    <input type="checkbox" id="search_english_enabled" value="1">
    <label for="search_english_enabled">
        English
    </label><br />

    <input type="checkbox" id="search_romanian_enabled" value="1">
    <label for="search_romanian_enabled">
        Romanian
    </label><br />

    <input type="checkbox" id="search_french_enabled" value="1">
    <label for="search_french_enabled">
        French
    </label><br />

    <input type="checkbox" id="search_german_enabled" value="1">
    <label for="search_german_enabled">
        German
    </label><br />

    <input type="checkbox" id="search_other_enabled">
    <label for="search_other_enabled">
        Other
        <input type="text" id="search_other" name="search_other">
    </label><br />

    <input type="checkbox" id="search_age_enabled">
    <label for="search_age_enabled">Age</label>
    <span id="search_age_display"></span>
    <br />
    <div id="search_age" class="slider"></div>

    <input type="checkbox" id="search_weight_enabled">
    <label for="search_weight_enabled">Weight</label>
    <span id="search_weight_display"></span>
    <br />
    <div id="search_weight" class="slider"></div>

    <input type="checkbox" id="search_height_enabled">
    <label for="search_height_enabled">Height</label>
    <span id="search_height_display"></span>
    <br />
    <div id="search_height" class="slider"></div>

    <input type="checkbox" id="search_shoe_enabled">
    <label for="search_shoe_enabled">Shoe</label>
    <span id="search_shoe_display"></span>
    <br />
    <div id="search_shoe" class="slider"></div>

    <input type="checkbox" id="search_dimension_1_enabled">
    <label for="search_dimension_1_enabled">Bust</label>
    <span id="search_dimension_1_display"></span>
    <br />
    <div id="search_dimension_1" class="slider"></div>

    <input type="checkbox" id="search_dimension_2_enabled">
    <label for="search_dimension_2_enabled">Waist</label>
    <span id="search_dimension_2_display"></span>
    <br />
    <div id="search_dimension_2" class="slider"></div>

    <input type="checkbox" id="search_dimension_3_enabled">
    <label for="search_dimension_3_enabled">Hip</label>
    <span id="search_dimension_3_display"></span>
    <br />
    <div id="search_dimension_3" class="slider"></div>

    <input type="submit" id="search_button" value="Search">

</form>

<div id="search_found_container">
    Here are the results
    <table id="search_found_table">
    </table>
    DONE
</div>

<script>

$(document).ready( function()
{
    $('#search_age').slider(
    {
        range :     true,
        min :       0,
        max :       90,
        values :    [ 18, 30 ],
        slide:      function( e, ui )
        {
            $('#search_age_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_age_display').text( '' + $('#search_age').slider( 'values', 0 ) + ' - ' + $('#search_age').slider( 'values', 1 ) );

    $('#search_weight').slider(
    {
        range :     true,
        min :       40,
        max :       200,
        values :    [ 50, 80 ],
        slide:      function( e, ui )
        {
            $('#search_weight_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_weight_display').text( '' + $('#search_weight').slider( 'values', 0 ) + ' - ' + $('#search_weight').slider( 'values', 1 ) );

    $('#search_height').slider(
    {
        range :     true,
        min :       100,
        max :       250,
        values :    [ 160, 190 ],
        slide:      function( e, ui )
        {
            $('#search_height_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_height_display').text( '' + $('#search_height').slider( 'values', 0 ) + ' - ' + $('#search_height').slider( 'values', 1 ) );

    $('#search_shoe').slider(
    {
        range :     true,
        min :       20,
        max :       60,
        values :    [ 25, 35 ],
        slide:      function( e, ui )
        {
            $('#search_shoe_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_shoe_display').text( '' + $('#search_shoe').slider( 'values', 0 ) + ' - ' + $('#search_shoe').slider( 'values', 1 ) );

    $('#search_dimension_1').slider(
    {
        range :     true,
        min :       50,
        max :       150,
        values :    [ 80, 100 ],
        slide:      function( e, ui )
        {
            $('#search_dimension_1_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_dimension_1_display').text( '' + $('#search_dimension_1').slider( 'values', 0 ) + ' - ' + $('#search_dimension_1').slider( 'values', 1 ) );

    $('#search_dimension_2').slider(
    {
        range :     true,
        min :       40,
        max :       140,
        values :    [ 50, 70 ],
        slide:      function( e, ui )
        {
            $('#search_dimension_2_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_dimension_2_display').text( '' + $('#search_dimension_2').slider( 'values', 0 ) + ' - ' + $('#search_dimension_2').slider( 'values', 1 ) );

    $('#search_dimension_3').slider(
    {
        range :     true,
        min :       50,
        max :       150,
        values :    [ 80, 100 ],
        slide:      function( e, ui )
        {
            $('#search_dimension_3_display').text( '' + ui.values[0] + ' - ' + ui.values[1] );
        }
    } );
    $('#search_dimension_3_display').text( '' + $('#search_dimension_3').slider( 'values', 0 ) + ' - ' + $('#search_dimension_3').slider( 'values', 1 ) );

    $('#search_button').click( function( e )
    {
        e.preventDefault();
        var likes = new Array();
        var intervals = new Array();
        var equals = new Array();

        function get_like( id )
        {
            return $( '#search_' + id ).val();
        }

        function get_interval( id )
        {
            return Array( $( '#search_' + id ).slider( 'values', 0 ), $( '#search_' + id ).slider( 'values', 1 ) );
        }

        function get_equal( id )
        {
            return $('#search_' + id).val();
        }

        var p = '';

        var data_likes = Array( 'first_name', 'last_name', 'email', 'phone', 'city', 'hair_color', 'dyed_hair_color', 'eyes_color' );
        var data_interval = Array( 'age', 'weight', 'height', 'shoe', 'dimension_1', 'dimension_2', 'dimension_3' );
        var data_equal = Array( 'sampling', 'merchandising', 'promotion', 'caravan', 'mistery_shopper', 'door_to_door', 'english', 'romanian', 'french', 'german' );

        var likes = [];
        var interval = [];
        var equal = [];

        for( i = 0 ; i < data_likes.length ; i++ )
        {
            var elem = $('#search_' + data_likes[i] + '_enabled:checked');
            if ( elem.length )
            {
                //p = p + "&" + data_likes[i] + '=' + $('#search_' + data_likes[i]).val() ;
                likes.push( [ data_likes[i], $('#search_' + data_likes[i]).val() ] );
            }
        }
        likes_string = $.toJSON( likes );

        for( i = 0 ; i < data_equal.length ; i++ )
        {
            var elem = $('#search_' + data_equal[i] + '_enabled:checked');
            if ( elem.length )
            {
                //p = p + "&" + data_equal[i] + '=' + elem.val() ;
                equal.push( [ data_equal[i], elem.val() ] );
            }
        }
        equal_string = $.toJSON( equal );

        for( i = 0 ; i < data_interval.length ; i++ )
        {
            var elem_enable = $('#search_' + data_interval[i] + '_enabled:checked');
            var elem = $('#search_' + data_interval[i]);
            if ( elem_enable.length )
            {
                //p = p + "&" + data_interval[i] + '[]=' + elem.slider( 'values', 0 ) 
                //      + "&" + data_interval[i] + '[]=' + elem.slider( 'values', 1 ) ;
                interval.push( [ data_interval[i], [ elem.slider( 'values', 0 ), elem.slider( 'values', 1 ) ] ] );
            }
        }
        interval_string = $.toJSON( interval );

        var params =    'likes=' + likes_string +
                        '&equal=' + equal_string +
                        '&interval=' + interval_string;

        $('#search_found_table tr').remove();

        $.post( 
            '/worker/search-action',
            params,
            function ( s, t )
            {
                var i = 0;
                for( i = 0 ; i < s['data']['workers'].length ; i++ )
                {
                    var cell = $('<td></td>').text( s['data']['workers'][i]['First_name'] );
                    var row = $('<tr></tr>').append( cell );

                    $('#search_found_table').append( row );
                }
            },
            'json'
        );
    } );


} );

</script>